<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <button class="btn_get">get请求</button>
  <button class="btn_post">post请求</button>
  <button class="btn_get2">get请求的完整写法</button>
  <button class="btn_post2">post请求的完整写法</button>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

  <script>
    document.querySelector('.btn_get').addEventListener("click", () => {
      axios.get("http://localhost:3000/api/getmsg")
        .then(result => {
          console.log(result);
          console.log(result.data);
        }).catch(error => {
          console.log("错误数据: " + error);
        }).finally(() => {
          console.log("最终都会指向的");
        })
    })
    document.querySelector('.btn_get2').addEventListener("click", () => {
      axios({
        url: "promisedata1",
        baseURL: "http://localhost:3000/api/",
        // method: "GET",
        params: {
          name: "张三",
          age: 18
        }
      })
        .then(result => {
          console.log(result);
          console.log(result.data);
        }).catch(error => {
          console.log("错误数据: " + error);
        }).finally(() => {
          console.log("最终都会指向的");
        })
    })
    document.querySelector('.btn_post').addEventListener("click", () => {
      axios.post("http://localhost:3000/api/postmsg", {
        name: "张三",
        age: 18
      })
        .then(result => {
          console.log(result);
          console.log(result.data);
        }).catch(error => {
          console.log("错误数据: " + error);
        })
    })
    document.querySelector('.btn_post2').addEventListener("click", () => {
      axios({
        url: "http://localhost:3000/api/postmsg",
        method: 'POST',
        data: {
          name: "张三",
          age: 18
        }
      })
        .then(result => {
          console.log(result);
          console.log(result.data);
        }).catch(error => {
          console.log("错误数据: " + error);
        })
    })

  </script>
</body>

</html>